.upload-tip {
  color: #8492a6;
  font-size: 12px;
  margin-top: 7px;
}
.demo-block {
  margin-bottom: 24px;

  .upload-demo {
    width: 360px;
  }
  .avatar-uploader {
    .el-upload {
      border: 1px dashed #d9d9d9;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;

      &:hover,
      &:focus {
        border-color: #409eff;
      }
    }
    .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      line-height: 178px;
      text-align: center;
    }
    .avatar {
      width: 178px;
      height: 178px;
      display: block;
    }
  }
}

.file-scopedslot {
  .el-upload-list__item {
    width: 105px !important;
    height: 105px !important;
    border-radius: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 8px 8px 0;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    img {
      width: 86px;
      height: 86px;
    }
    .el-upload-list__item-actions {
      position: absolute;
      width: 86%;
      height: 86%;
      left: 7px;
      top: 7px;
      cursor: default;
      text-align: center;
      color: #fff;
      opacity: 0;
      font-size: 20px;
      background-color: rgba(0,0,0,.5);
      transition: opacity .3s;
      display: flex;
      align-items: center;
      justify-content: space-evenly;
      cursor: pointer;

      &:hover {
        opacity: 1;
      }
    }
  }
}


